<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<title>老师详情</title>
		<link rel="stylesheet" href="../../resources/css/teacher.css" />
		<link rel="stylesheet" href="../../resources/layui/css/layui.css" />
		<script type="text/javascript" src="../../resources/js/jquery-1.11.1.min.js"></script>
		<script type="text/javascript" src="../../resources/layui/layui.all.js"></script>
	</head>

	<body>
		<jsp:include page="/pages/common/header.jsp"></jsp:include>
		<script>
			//去掉所有的html标记
			function delHtmlTag(str) {
				return str.replace(/<[^>]+>/g, "");
			}
		</script>
		<div class="main">
			<div class="head">

			</div>
			<div class="content">
				<ul class="course">
					<li class="teach_course">
						<div class="cou_img">
							<img src="../../resources/images/course/course12.png" />
						</div>
						<div class="other">
							<div class="title">
								<p class="text">HTML5和CSS3扁平化风格博客</p>
							</div>
							<span class="tag">HTML5</span>

							<div class="details">
								<p class="dtext">HTML5和CSS3扁平化风格博客HTML5和CSS3扁平化风格博客HTML5和CSS3扁平化风格博客HTML5和CSS3扁平化风格博客HTML5和CSS3扁平化风格博客HTML5和CSS3扁平化风格博客</p>
							</div>
							<div class="sp">
								<span class="layui-icon layui-icon-user"></span>
								<span class="nub">20人</span>
								<span class="layui-icon layui-icon-date"></span>
								<span class="nub">2018-6-28</span>

							</div>
						</div>
						<div class="editcourse">
							<a href="/pages/teacher/uploadcourse.jsp?courseId="><span class="layui-btn layui-btn-danger">编辑课程</span></a>
						</div>
					</li>

				</ul>
				<div class="r_box">
					<img src="" alt="" />
				</div>
			</div>
			<div style="clear: both;"></div>
			<!--分页-->
			<div class="pageing" style="width: 1200px;margin: auto;"><div id="page">
			</div></div>
			
		<jsp:include page="/pages/common/footer.jsp"></jsp:include>
		<script >
			$(document).ready(function(){
				var loading = layer.msg('加载中！请稍后....', {
					icon: 16,
					shade: 0.01
				});
				$.ajax({
					type:"post",
					url:"/course/queryCourseByUserId.action",
					data:{
						"pageCount": 1,
						"pageSize": 7
					},
					dataType:"json",
					success: function(result){
						console.log(result.row);
						var currpage = result.totalPage;
						var pagecount = result.pageSize;
						layui.use("laypage", function() {
							var laypage = layui.laypage;
							laypage.render({
								elem: 'page',
								count: currpage * pagecount, //总页数
								limit: 7,
								jump: function(obj, first) {
									console.log(obj.curr); //得到当前页，以便向服务端请求对应页的数据。
									console.log(obj.limit); //得到每页显示的条数
									var pageIndex = obj.curr;
									var pageLimit = obj.limit;
									//首次不执行
									if(!first) {
										$(".course").html("");
										toPage(pageIndex, pageLimit);
									}
								}
							});
						});
						$.each(result.row, function(rowindex, rowitem)  {
							
							if(rowitem.coursePicture == undefined) {
								rowitem.coursePicture = "../../resources/images/course/course12.png";
							}
							if(rowitem.studyNumber == undefined) {
								rowitem.studyNumber = 0;
							}
							console.log(rowitem.courseId)
							var li = "<li class='teach_course'><div class='cou_img'><img src='"+rowitem.coursePicture+"'/></div>";
							li += "<div class='other'><div class='title'><p class='text'>"+rowitem.courseName+"</p></div>";
							li += "<span class='tag'>"+rowitem.adopt+"</span>";
							li += "<div class='details'><p class='dtext'>"+delHtmlTag(rowitem.courseDescribe)+"</p></div>";
							li += "<div class='sp'><span class='layui-icon layui-icon-user'></span><span class='nub'>"+rowitem.studyNumber+"人</span>";
							li += "<span class='layui-icon layui-icon-date'></span><span class='nub'>"+rowitem.updateTime+"</span></div></div>";
							li += "<div class='editcourse'><a href='/pages/teacher/addcourse.jsp?courseId="+rowitem.courseId+"'><span class='layui-btn layui-btn-danger'>编辑课程</span></a></div></li>";
							$(".course").append(li);
						});
						layer.msg('加载成功！！', {
							icon: 1,
							time: 1000,
						});
					}
				});
			})
		</script>
		<script>
			function toPage(pageCount, pageSize) {
				var loading = layer.msg('加载中！请稍后....', {
					icon: 16,
					shade: 0.01
				});
				$.ajax({
					type: "get",
					url:"/course/queryCourseByUserId.action",
					data: {
						"pageCount": pageCount,
						"pageSize": pageSize
					},
					dataType: "json",
					success: function(result) {
						
						$.each(result.row, function(rowindex, rowitem)  {
							
							if(rowitem.coursePicture == undefined) {
								rowitem.coursePicture = "../../resources/images/course/course12.png";
							}
							if(rowitem.studyNumber == undefined) {
								rowitem.studyNumber = 0;
							}
							var li = "<li class='teach_course'><div class='cou_img'><img src='"+rowitem.coursePicture+"'/></div>";
							li += "<div class='other'><div class='title'><p class='text'>"+rowitem.courseName+"</p></div>";
							li += "<span class='tag'>"+rowitem.adopt+"</span>";
							li += "<div class='details'><p class='dtext'>"+delHtmlTag(rowitem.courseDescribe)+"</p></div>";
							li += "<div class='sp'><span class='layui-icon layui-icon-user'></span><span class='nub'>"+rowitem.studyNumber+"人</span>";
							li += "<span class='layui-icon layui-icon-date'></span><span class='nub'>"+rowitem.updateTime+"</span></div></div>";
							li += "<div class='editcourse'><a href='/pages/teacher/addcourse.jsp?courseId="+rowitem.courseId+"'><span class='layui-btn layui-btn-danger'>编辑课程</span></a></div></li>";
							$(".course").append(li);
						});
						layer.msg('加载成功！！', {
							icon: 1,
							time: 1000,
						});

					}
				});
			}
		
		</script>
	</body>

</html>